import Vue from 'vue'
import VueRouter from 'vue-router'
import Films from '../views/Films'
import Aritcle from '../views/Article'
import Center from '../views/Center'
import MovieDetail from '../views/Films/MovieDetail.vue'
import NowPlaying from '../views/Films/children/NowPlaying.vue'
import ComingSoon from '../views/Films/children/ComingSoon.vue'
import City from '../views/city/City.vue'
Vue.use(VueRouter)

const routes = [{
  path: "/",
  redirect: "/films/nowPlaying"
},
{
  path: '/films',
  name: 'Films',
  component: Films,
  meta: {
    isNav: true
  },
  children: [
    {
      path: "nowPlaying",
      component: NowPlaying,
      meta: {
        isNav: true
      },
    }, {
      path: "comingSoon",
      component: ComingSoon,
      meta: {
        isNav: true
      },
    },
  ]
},
{
  path: '/article',
  name: 'About',
  component: Aritcle,
  meta: {
    isNav: true
  }
}, {
  path: "/center",
  name: "Center",
  component: Center,
  meta: {
    isNav: true
  }
}, {
  path: `/movieDetail`,
  name: "MovieDetail",
  component: MovieDetail
},
 {
  path: '/city',
   name: "City",
   component: City
},
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router